<template>
	<view class="authorize">
		<image class="authorize-icon" src="/static/logo.png" />
		<view class="auth-title">幸运王者申请获取以下权限</view>
		<view class="auth-tip">获取你的公开信息(头像/昵称等)</view>
		<view class="btn-authorize">
			<view class="mc-f14 mc-red mc-text-centent" style="margin-bottom: 40rpx;" v-if="errMsg">{{errMsg}}</view>
			<button class="main-btn" open-type="getUserInfo" lang="zh_CN" @getuserinfo="onGotUserInfo">确认授权</button>
		</view>
	</view>
</template>
<script>
	import {
		mapGetters,
		mapActions
	} from 'vuex';
	export default {
		name: 'c-login',
		props: {
			isTokenInvalid: {
				type: Boolean,
				default: false
			}
		},
		components: {},
		data() {
			return {
				errMsg: '',
			};
		},
		computed: {
			...mapGetters('user', ['_isLogin', '_userInfo', '_code', '_token', '_shareUserId']),
			...mapGetters('common', ['_enterUrl']),
		},
		methods: {
			...mapActions('user', ['isLoginUp', 'userInfoUp', 'codeUp', 'tokenUp']),
			onGotUserInfo(e) {
				this.userInfoUp(e.detail.userInfo);
				if (e.detail.errMsg == 'getUserInfo:ok') {
					this.login();
				}
			},

			enterHome() {
				if (this._isLogin) {
					this.$emit('enter')
				}
			},

			async login() {
				let res = await uni.login();
				if (res[1].code) {
					this.codeUp(res[1].code);
					let getUserInfo = await uni.getUserInfo();
					let result = await this.convertToken(getUserInfo[1], this._code);
					if (result) {
						this.tokenUp(result.token);
						this.isLoginUp(true);
						this.enterHome();
					}
				}
			},

			// 访问后台进行登录，换取token
			async convertToken(userInfoRes, code) {
				try {
					console.info('shareId', this._shareUserId)
					let res = await this.$api.login.convertQQToken({
						code: code,
						encryptedData: userInfoRes.encryptedData,
						iv: userInfoRes.iv,
						shareId: this._shareUserId || null,
					});
					return res;
				} catch (e) {
					//TODO handle the exception
					console.log(e)
					this.errMsg = e
				}
			},

			// 若已经授权了，但本地还没有数据，就自动登陆
			async autoLogin() {
				let _this = this;
				let res = await uni.getSetting();
				if (res[1].authSetting['scope.userInfo']) {
					if (this._isLogin) {
						this.enterHome();
					} else {
						// 需要重新登录拉取用户信息
						this.login();
					}
				}
			}
		},
		created() {},
		mounted() {
			let _this = this;
			if (this.isTokenInvalid) {
				this.codeUp('');
				this.tokenUp('');
				this.isLoginUp(false);
			}
			// 获取用户授权信息
			uni.checkSession({
				success() {
					// session_key 未过期，并且在本生命周期一直有效
					_this.autoLogin();
				},
				fail() {
					// session_key 已经失效，需要重新执行登录流程
					_this.autoLogin(); // 重新登录
				}
			});
		},
	};
</script>
<style lang="scss" scoped>
	.authorize {
		height: 100%;
		text-align: center;
		padding-top: 180upx;

		.authorize-icon {
			width: 240upx;
			height: 240upx;
			display: block;
			margin: 0 auto 50upx;
		}

		.auth-title {
			margin-bottom: 10upx;
			color: black;
			font-size: 40upx;
		}

		.auth-tip {
			font-size: 24upx;
			color: #999999;
		}

		.btn-authorize {
			width: 100%;
			height: auto;
			padding-top: 140upx;
			overflow: hidden;

			.main-btn {
				background-color: #ff719b;
				color: #fff;
				font-size: 32upx;
				height: 110upx;
				line-height: 110upx;
				text-align: center;
				width: 380upx;
				margin: 0 auto;
				border-radius: 110upx;
			}
		}
	}
</style>
